<div class="search-header">
  <div class="row">
    <div class="col d-flex" style="align-items: center;">
      <div>
        <%= link_to root_path do %>
          <%= image_tag "search-result.png", width: 115, height: 50 %>
        <% end %>
      </div>
      <div>
        <%= form_with url: search_path, method: :get, data: {remote: false} do %>
          <div class="input-group mb-3 mt-3" style="width: 600px;">
            <input
              name="keyword"
              value="<%= @keyword %>"
              type="text"
              class="form-control"
              aria-label="Recipient's username"
              aria-describedby="basic-addon2"
            >
            <button type="submit" class="input-group-text">搜狗搜索</button>
          </div>
        <% end %>
      </div>
    </div>
    <div class="col-md-3">
      <div
        class="d-flex search-result-nav"
        style="color: #999; justify-content: flex-end"
      >
        <div>无障碍</div>
        <div>|</div>
        <div>设置</div>
        <div>登录</div>
      </div>
    </div>
  </div>
  <div class="row">
    <div class="d-flex search-options" style="margin-left: 125px; cursor: pointer;">
      <div class="active">网页</div>
      <div>微信</div>
      <div>知乎</div>
    </div>
  </div>
</div>

<div
  class="search-results"
  style="padding-left: 125px;padding-top: 20px; width: 50%;"
>

  <% if @banned %>
    <p class="alert alert-danger">您的搜索包含敏感关键词</p>
  <% else %>
    <p style="font-size: 11px; color: #999;">搜狗已为您找到约<%= @total %>条相关结果</p>

    <% @pages.each do |page| %>
      <div class="item">
        <div><%= link_to "#{@keyword} - #{page.title}", "#" %></div>
        <div style="margin-top: 10px;">
          <span style="color: #999;"><%= page.day&.strftime("%Y年%m月%d日") %></span>
          <%= page.note %>
        </div>
        <div style="color: green;margin-top: 10px;">
          <span class="from"><%= page.from %></span>
          -
          <span class="url"><%= page.url %></span>
          -
          <span class="day"><%= page.day %></span>
        </div>
      </div>
    <% end %>

    <%= paginate @pages %>
  <% end %>
</div>
